import styled from "styled-components";

export const DjRadioCategoryWrap = styled.div`
  .new-radio-box {
    padding: 40px;
    padding-bottom: 20px;
    .new-radio-text {
      height: 42px;
      line-height: 42px;
      border-bottom: 2px solid #c20c0c;
      p {
        font-size: 24px;
      }
    }
  }
  .new-radio-banners {
    padding: 0 40px;
    .new-radio-banners-box {
      width: 150px;
      margin-left: 37px;
      :nth-child(1) {
        margin-left: 0;
      }
      img {
        width: 150px;
        height: 150px;
      }
      .new-radio-banners-name {
        margin: 13px 0 6px;
        line-height: 16px;
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        width: 11em;
      }
      .new-radio-banners-rcmdtext {
        color: #999;
        line-height: 18px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
      }
    }
    ::after {
      content: "";
      clear: both;
      display: block;
      overflow: hidden;
    }
  }
  .radio-ranking-box {
    padding: 40px;
    padding-bottom: 20px;
    .radio-ranking-text {
      height: 42px;
      line-height: 42px;
      border-bottom: 2px solid #c20c0c;
      display: flex;
      justify-content: space-between;
      p {
        font-size: 24px;
      }
      .radio-ranking-checkbox {
        a {
          text-decoration: none;
        }
        .z-sel {
          color: #c20c0c;
        }
        span {
          padding: 0 15px;
        }
      }
    }
    .radio-ranking-hot-box {
      .radio-hot-box {
        width: 435px;
        padding: 20px 0;
        margin-right: 30px;
        border-bottom: 1px solid #e7e7e7;
        display: flex;
        :nth-child(2n) {
          margin-right: 0;
        }
        img {
          width: 120px;
          height: 120px;
        }
        .radio-hot-text-box {
          margin-left: 20px;
          .ht-name {
            text-decoration: none;
            color: #333;
            font-weight: 700;
            font-size: 18px;
          }
          .ht-nm {
            padding-bottom: 10px;
            .icongr {
              width: 14px;
              height: 15px;
              display: block;
              background-position: -50px -300px;
            }
            a {
              padding: 0 5px;
            }
            img {
              width: 14px;
              height: 14px;
            }
          }
          .ht-span {
            span {
              color: #999;
              :nth-child(1) {
                padding-right: 20px;
              }
            }
          }
        }
      }
      ::after {
        content: "";
        clear: both;
        display: block;
        overflow: hidden;
      }
    }
  }
  .tcr {
    .ant-pagination {
      text-align: center !important;
    }
  }
  .anticon {
    background-image: none;
  }
`;
